/*base*/
* { margin: 0; padding: 0 }
body { font: 12px "宋体", Arial, Helvetica, sans-serif; color: #756F71 }
img { border: 0; display: block }
ul { list-style: none; }
a:link, a:visited {text-decoration: none; color: #333;}
.left { float: left; }
.right { float: right; }
.blank { height: 5px; overflow: hidden; width: 100%; margin: auto; clear: both }
header { width: 1000px; margin: auto; height: 80px; position: relative; overflow: hidden }
#logo a { width: 260px; height: 60px; margin: 10px 0 0 0; position: absolute; background: url(../images/logo.png) no-repeat; display: block }
nav { float: right; width: 100%; margin: 30px 0 0 0; text-align: right }
nav a { position: relative; display: inline-block; font-size: 18px; font-family: "微软雅黑", Arial, Helvetica, sans-serif; }
nav a:hover { text-decoration: none }
.topnav a { margin: 0 5px; padding: 0 8px; }
.topnav a span:first-child { z-index: 2; display: block; }
.topnav a span:last-child { z-index: 1; display: block; color: #999; font: 12px Georgia, serif; opacity: 0; -webkit-transition: -webkit-transform 0.3s, opacity 0.3s; -moz-transition: -moz-transform 0.3s, opacity 0.3s; transition: transform 0.3s, opacity 0.3s; -webkit-transform: translateY(-100%); -moz-transform: translateY(-100%); transform: translateY(-100%); text-align: center }
.topnav a:hover span:last-child, .topnav a:focus span:last-child { opacity: 1; -webkit-transform: translateY(0%); -moz-transform: translateY(0%); transform: translateY(0%); }
#topnav_current { color: #e15782; }
.en { color: #999; font-size: 12px; z-index: 1; display: block; }/* ie */
article { width: 1000px; margin: 20px auto; overflow: hidden }
aside { width: 250px; }
footer { text-align: center; line-height: 40px; border-top: #E8E8E8 1px solid ; width:1000px; margin:auto}
h1.t_nav span { float: right; color: #999; background:url(../images/5849.png) no-repeat left center; padding-left:20px }
h1.t_nav span a { margin: 0 5px }
h1.t_nav { border-bottom: #F1F1F1 1px solid; font-size: 12px; font-weight: normal; line-height: 40px; height: 40px; }
a.n1, a.n2 { width: 100px; display: block; text-align: center; color: #fff; float: left }
.n1 { background: #5EA51B; }
.n2 { background: #8BBF5D; }

/*右边栏样式*/
.news h3 { font-size: 14px; background: url(../images/r_title_bg.jpg) repeat-x center ;margin-top: 20px}
.news h3 p { background: #fff; width: 70px }
.news h3 span { color: #65b020 }
.news h3.ph span { color: #37ccca; }
.news h3.links span { color: #F17B6B; }
.news ul { margin-bottom: 20px }
.news ul li a:hover { text-decoration: underline }
.rank li { height: 25px; line-height: 25px; clear: both; padding-left: 5px; overflow: hidden; padding-left: 15px; background: url(../images/li.jpg) no-repeat left center; }
.rank { margin: 10px 0 }
.rank li a { color: #333; }
.paih { background: url(../images/ph.jpg) no-repeat left 8px; margin: 10px 0 }
.paih li { line-height: 30px; height: 30px; overflow: hidden; padding-left: 24px; border-bottom: #CCC dotted 1px }
.website { margin: 10px 0; background: #F3F3F3; border-radius: 50%; text-align: center; }
.weather { margin: 20px 0; width: 250px;height: 100px}
.website li { line-height: 26px; text-shadow: #fff 1px 1px 1px; height: 26px; }
.weixin { background: url(../images/weixin.jpg) no-repeat; width: 100%; display: inline-block; height: 250px; overflow: hidden; margin: 10px 0; clear: both }
aside .rnav ul li a:hover { background: rgba(255,255,255,0.2); -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); }
.ad{ width:100%; margin:10px auto;}
.duoshuo{ width:710px;overflow: hidden; background: url(../images/r_line.jpg) repeat-y right; line-height:22px; margin:20px auto;padding-right: 30px; }

/*翻页样式*/
.page{ margin:20px 0 0 0; text-align:center; width:100%;overflow: hidden;}
.page a b {color: #999;}
.page>b,.page a {margin: 0 2px;height: 26px;line-height: 26px;border-radius: 50%;width: 26px;text-align: center;display: inline-block}
.page a {margin: 0 2px;height: 26px;line-height: 26px;border-radius: 50%;width: 26px;text-align: center;display: inline-block}/* 针对IE6 */
.page>b,.page a:hover{background: #333;color: #FFF;}
.page a {color: #F33;border: #999 1px solid;}

.ds-avatar {
float: left;
}

/*自定义滑动条*/
::-webkit-scrollbar {
  width: 10px;
  background: #eee;
  opacity: .8;  
}
::-webkit-scrollbar-button {
  width: 10px;
  height: 5px;
}
::-webkit-scrollbar-track {
  background: #eee;
  border: 1px solid lightgray;
  box-shadow: 0px 0px 3px #dfdfdf inset;
  border-radius: 10px;
}
::-webkit-scrollbar-thumb {
  background: #969696;
  border: thin solid gray;
  border-radius: 10px;
  -webkit-transition: background .25s linear;
}
::-webkit-scrollbar-thumb:hover {
  background: #7d7d7d;
  -webkit-transition: background .25s linear;
}



/*book*/
.aboutme{ color:#696969;background: url(../images/aboutphoto.jpg) no-repeat;width: 242px; height: 240px;}
.book{ width:710px;overflow: hidden; background: url(../images/r_line.jpg) repeat-y right; line-height:22px; margin:20px auto;padding-right: 30px; }
.about_c{ padding:0px 0 0 10px; color:#999; line-height:26px;margin:20px auto  }
.about_c img{ margin:5px 0}
.about_c span{ color:#19A566}



/*index*/
.banner { background: url(../images/banner_top.jpg) top center; height: 265px; overflow: hidden }
.box{ width:1300px; margin:auto; overflow:hidden}
.boxphoto{ width:1000px; margin:auto; overflow:hidden}
.texts { width: 350px; line-height: 26px; margin: 60px 0 0 100px; float: left; font-size: 14px; }
.texts p { -webkit-transform: translate(60px); -moz-transform: translate(60px); -o-transform: translate(60px); -ms-transform: translate(60px); transform: translate(60px); text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.8), 2px 2px 3px rgba(180, 151, 151, 0.3); }
.texts p:nth-child(1) { -webkit-animation: animations 3s ease-out 1s backwards; -moz-animation: animations 3s ease-out 1s backwards; -o-animation: animations 3s ease-out 1s backwards; -ms-animation: animations 3s ease-out 1s backwards; animation: animations 3s ease-out 1s backwards; }
.texts p:nth-child(2) { -webkit-animation: animations 3s ease-out 4s backwards; -moz-animation: animations 3s ease-out 4s backwards; -o-animation: animations 3s ease-out 4s backwards; -ms-animation: animations 3s ease-out 4s backwards; animation: animations 3s ease-out 4s backwards; }
.texts p:nth-child(3) { -webkit-animation: animations2 5s ease-in-out 7s backwards; -moz-animation: animations2 5s ease-in-out 7s backwards; -o-animation: animations2 5s ease-in-out 7s backwards; -ms-animation: animations2 5s ease-in-out 7s backwards; animation: animations2 5s ease-in-out 7s backwards; }
@-webkit-keyframes animations { 0% {-webkit-transform:translate(0);opacity:0;} 50% {-webkit-transform:translate(30px);opacity:.5;} 100% {-webkit-transform:translate(60px);
opacity:1;}}@-moz-keyframes animations { 0% {-moz-transform:translate(0);opacity:0;} 50% {-moz-transform:translate(30px);opacity:.5;} 100% {-moz-transform:translate(60px);
opacity:1;}}@-o-keyframes animations { 0% {-o-transform:translate(0);opacity:0;} 50% {-o-transform:translate(30px);opacity:.5;} 100% {-o-transform:translate(60px);opacity:1;
}}@-ms-keyframes animations { 0% {-ms-transform:translate(0);opacity:0;} 50% {-ms-transform:translate(30px);opacity:.5;} 100% {-ms-transform:translate(60px);opacity:1;
}}@keyframes animations { 0% {transform:translate(0);opacity:0;} 50% {transform:translate(30px);opacity:.5;} 100% {transform:translate(60px);opacity:1;}}@-webkit-keyframes animations2 { 0% {
opacity:0;} 40% {opacity:.8;} 45% {opacity:.3;} 50% {opacity:.8;} 55% {opacity:.3;} 60% {opacity:.8;} 100% {opacity:1;}}@-moz-keyframes animations2 { 0% {opacity:0;
} 40% {opacity:.8;} 45% {opacity:.3;} 50% {opacity:.8;} 55% {opacity:.3;} 60% {opacity:.8;} 100% {opacity:1;}}@-o-keyframes animations2 { 0% {opacity:0;} 40% {opacity:.8;
} 45% {opacity:.3;} 50% {opacity:.8;} 55% {opacity:.3;} 60% {opacity:.8;} 100% {opacity:1;}}@-ms-keyframes animations2 { 0% {opacity:0;} 40% {opacity:.8;} 45% {opacity:.3;
} 50% {opacity:.8;} 55% {opacity:.3;} 60% {opacity:.8;} 100% {opacity:1;}}@keyframes animations2 { 0% {opacity:0;} 40% {opacity:.8;} 45% {opacity:.3;} 50% {opacity:.8;
} 55% {opacity:.3;} 60% {opacity:.8;} 100% {opacity:1;}}

.template { background: #F1F0EE }
.template h3 { border-bottom: #FFF 1px solid; width: 100%; overflow: hidden; font-size: 14px; margin: 0 0 10px; font-family: "微软雅黑"; display: block; clear: both; }
.template h3 p { background: #474645; width: 180px; height: 25px; margin: 15px 0 0 10px; line-height: 25px; color: #fff; text-align: center; box-shadow: #999 4px 5px 1px; }
.template h3 p span { color: #38b3d4; }
.template ul { overflow: hidden; }
.template ul li { margin: 3px; float: left; display: block; padding: 5px 5px 6px 5px; -webkit-transition: all 1s; -moz-transition: all 1s; -o-transition: all 1s; transition: all 1s; }
.template li img { width: 142px; height: 80px; background: #FFF; padding: 4px; box-shadow: 0px 0px 2px rgba(0,0,0,.5); display: block; }
.template li span { color: #F1F0EE; display: block; text-align: center; margin-top: 5px; width: 142px; overflow: hidden; text-overflow: ellipsis; height: 14px }
.template li:hover { background: #666; padding: 5px 5px 6px 5px; }
h2.title_tj { font: 18px "微软雅黑", Arial, Helvetica, sans-serif; color: #444; font-weight: bold; background: url(../images/h_line.jpg) repeat-x 20px center; }
h2.title_tj span { color: #FE5187 }
h2.title_tj p { background: #fff; width: 90px }

.avatar { float: right; margin: 40px 20px 0px 0px; width: 130px; height: 130px; border-radius: 100%; overflow: hidden; border: #FFF 4px solid }
.avatar a { display: block; padding-top: 97px; width: 160px; background: url(../images/avatar.png) no-repeat; background-size: 130px 130px }
.avatar a span { display: block; margin-top: 63px; padding-top: 8px; width: 130px; height: 55px; text-align: center; line-height: 20px; color: #fff; background: rgba(0, 0, 0, .5); -webkit-transition: margin-top .2s ease-in-out; -moz-transition: margin-top .2s ease-in-out; -o-transition: margin-top .2s ease-in-out; transition: margin-top .2s ease-in-out; }
.avatar a:hover span { display: block; margin-top: 0; }

.avatarher { float: right; margin: 40px 10px 0px 0px; width: 130px; height: 130px; border-radius: 100%; overflow: hidden; border: #FFF 4px solid }
.avatarher a { display: block; padding-top: 97px; width: 160px; background: url(../images/avatarher.jpg) no-repeat; background-size: 130px 130px }
.avatarher a span { display: block; margin-top: 63px; padding-top: 8px; width: 130px; height: 55px; text-align: center; line-height: 20px; color: #fff; background: rgba(0, 0, 0, .5); -webkit-transition: margin-top .2s ease-in-out; -moz-transition: margin-top .2s ease-in-out; -o-transition: margin-top .2s ease-in-out; transition: margin-top .2s ease-in-out; }
.avatarher a:hover span { display: block; margin-top: 0; }

.lock { float: right; margin: 80px 10px 0px 0px; width: 46px; height: 55px; border-radius: 100%; overflow: hidden; background: url(../images/lock.png) no-repeat}



/*life*/
.bloglist { width: 740px; overflow: hidden; background: url(../images/r_line.jpg) repeat-y right; }
.bloglist h3 { margin: 20px 0 10px 0; color: #333 }
.bloglist figure { float: left; width: 183px; }
.bloglist figure img { padding: 4px; border: #f4f2f2 1px solid; width: 175px; }
.bloglist ul { float: left; width: 520px; margin: 10px 0px 0 15px; line-height: 20px; }
.lifedateview { width: 695px; overflow: hidden; clear: both; margin: 10px 0 0 0; display: inline-block; background: #f6f6f6 url(../images/time.jpg) 15px center no-repeat; line-height: 26px; height: 26px; color: #838383; padding-left: 25px }
.lifedateview span { margin: 0 10px; }
.lifedateview span a { color: #099B43; }
a.readmore { background: #fd8a61; color: #fff; padding: 5px 10px; float: right; margin: 20px 0 0 0 }



/*mood*/
.moodlist { margin: auto; width: 100%; overflow: hidden }
.mooddiv { width: 1000px; margin: 0 auto; background: url(../images/r_title_bg.jpg) repeat-y 764px 0;overflow: hidden; }
.arrow_box { background: #f8f8f8; box-shadow: 0px 1px 0px rgba(255,255,255,.1), inset 0px 1px 1px rgba(214, 214, 214, 0.7); width: 730px; border-radius: 6px; position: relative; padding: 20px 0; margin: 20px 0; }
.arrow_box img { width: 150px; float: left; margin: 0 20px 0 20px; }
.arrow_box p { line-height: 24px; padding: 0 20px 20px }
.arrow_box::before { content: ""; width: 0px; height: 0px; border-style: solid; border-width: 0px 0 20px 22px; border-color: transparent transparent transparent #fff; position: absolute; left: 730px; top: 23px; }/* Èý½ÇÐÎ */
.arrow_box::after { content: ""; width: 10px; height: 10px; border-radius: 50%; position: absolute; left: 758px; top: 16px; background: #CCCCCE; border: 2px solid #fff; transition: all 0.5s; }/* Ô²ÐÎ */
.arrow_box:hover::before { border-color: transparent transparent transparent #CECCCD }/* Èý½ÇÐÎ */
.arrow_box:hover::after { border: #fff 2px solid; background: #5EA51B }/* Ô²ÐÎ */
.arrow_box:hover { background: #f4f2f2; color: #333; text-shadow: #f7f7f7 1px 1px 1px }
.dateview { position: absolute; left: 788px; top: 20px; width: 125px; line-height: 30px; background: #5EA51B; border-radius: 0px 40px; text-align: center; color: #fff }
.page { margin: 20px 0; text-align: center; width: 100%; overflow: hidden; }
.page a b { color: #999; }
.page>b, .page a { margin: 0 2px; height: 26px; line-height: 26px; border-radius: 50%; width: 26px; text-align: center; display: inline-block }
.page a { margin: 0 2px; height: 26px; line-height: 26px; border-radius: 50%; width: 26px; text-align: center; display: inline-block }/* Õë¶ÔIE6 */
.page>b, .page a:hover { background: #333; color: #FFF; }
.page a { color: #F33; border: #999 1px solid; }
.sy{overflow: hidden;}



/*new*/
.index_about { float: left; width: 740px; overflow: hidden; background: url(../images/r_line.jpg) repeat-y right; margin: 10px 0 }
.c_titile { font-size: 22px; margin: 20px 0; text-align: center }
.box_c { border: #ccc 1px dashed; text-align: center; padding: 5px 0; margin-right: 30px;color: #999;}
.box_c span { margin: 0 10px; }
.box_c span a{color: #099;}
ul.infos { overflow: hidden; margin: 20px 30px 20px 0; line-height: 28px; font-size: 14px; text-indent: 2em; }
ul.infos p { margin-bottom: 20px }
ul.infos p img { display: block;margin: auto; max-width:100%;}
.keybq { background: url(../images/6264.png) no-repeat 10px center #F8F8F8; line-height: 30px; height: 30px; padding-left: 40px; border: 1px solid #F0F0F0; margin-right: 20px; }
.keybq span { color: #099 }
.nextinfo { line-height: 24px; }
.otherlink h2 { border-bottom: #099 2px solid; line-height: 40px; font-size: 12px; font-weight: normal; margin-right: 20px; background:url(../images/5794.png) 10px center no-repeat; padding-left:40px}
.otherlink ul { margin: 10px 0 }
.otherlink li { line-height: 24px; height: 24px; display: block; width: 290px; float: left; overflow: hidden; margin-right: 30px; }
.otherlink li a:hover{ text-decoration:underline}